<template>
  <e-panel v-bind="opts">
    <template #otherModal>
      <auth-modal ref="authModalRef" />
    </template>
  </e-panel>
</template>

<script lang="ts" setup>
  import Model from './model'
  import { usePanel } from '@/components/ext'
  import { ButtonActions } from '@/components/ActionButton/commonActions'
  import { useCompRef } from '@/hooks/useCompRef'
  import AuthModal from './comp/AuthModal.vue'

  defineOptions({
    name: 'SysRoleList'
  })

  const authModalRef = useCompRef(AuthModal)

  const handleAuth = ({ row: { id: roleId } }) => {
    authModalRef.value!.open(roleId)
  }

  const rowActions: ButtonActions = [
    {
      action: 'auth',
      html: '授权',
      text: true,
      type: 'info',
      perms: 'auth',
      handle: handleAuth
    },
    'edit',
    'delete'
  ]
  const opts = usePanel(Model, { tableProps: { actions: rowActions } })
</script>

<style scoped></style>
